<template>
  <div class="info">
    <h3>转移仓库</h3>
    <el-divider />

    <div class="box-card">
      <p style="width: 800px">
        - 转移需对方确认接受，转移成功后你将被移出仓库，其他已有成员权限不变
      </p>
      <p style="height: 10px"></p>
      <p style="width: 800px">
        - 转移成功后，仓库的地址将变更至目标用户的命名空间下
      </p>
      <p style="height: 10px"></p>
      <p style="width: 800px">
        - 已有成员如需继续操作仓库，需更新本地仓库的 remote，使之指向新的地址
      </p>
    </div>

    <h4>转移给用户</h4>
    <div style="margin-top: 15px">
      <!-- <el-select-v2
        v-model="value"
        style="width: 240px;width: 600px;"
        size="large"
        filterable
        clearable
        :options="options"
        placeholder="请输入目标用户的完整账号"

      /> -->
      <el-input
        v-model="value"
        placeholder="请输入用户名或账号"
        style="width: 400px"
      />
    </div>

    <div style="margin-top: 15px">
      <el-button type="warning" @click="transfer" id="button"
        >确认转移</el-button
      >
    </div>
  </div>
</template>


<script>
import { ElMessage } from "element-plus";
import request from "@/utils/request";
export default {
  data() {
    return {
      options: [
        {
          label: "a",
          value: 1,
        },
        {
          label: "abcd",
          value: 2,
        },
        {
          label: "bcd",
          value: 3,
        },
      ],
      value: "",
    };
  },

  methods: {
    transfer() {
      if (this.value == "") {
        ElMessage("请输入用户名或账号");
      } else {
        request
          .post(
            `${this.$route.params.username}/${this.$route.params.housename}/housesetting-transfer`,
            {
              value: this.value,
            }
          )
          .then((res) => {
            if (res.code == 200) {
              ElMessage("仓库转移成功");
            } else {
              ElMessage("用户不存在");
            }
          });
      }
    },
  },
};
</script>






<style>
.info {
  display: inline-block;
  position: absolute;
  margin-top: 3%;
  margin-left: 5%;
}

.box-card {
  padding: 1em 1.5em;
  position: relative;
  font-size: 0.8em;
  border-radius: 4px;
  border: 1px solid #e3e9ed;
  background: #573a08;
  background-color: #fffaf3;
  box-shadow: 0px 0px 0px 1px #c9ba9b inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  margin-top: 0px;
  display: block;
  color: #573a08;
  margin-bottom: 15px;
}
#button:hover {
  cursor: default;
}
</style>